<template>
	<view>
		<view class="bg_1"></view>
		<view class="flex_row_start_center home_top"   :style="{ top: 'calc(' + statusBarHeight + ' + 20rpx)' }">
			<view class="topic">维客思通</view>
		
		</view>
		<view :style="{ 'margin-top': 'calc(' + statusBarHeight + ' + 100rpx)' }" class="home_info">
			<!-- 命主信息 -->
			
		    
			<!-- 老师建议 -->
		
			
			<!-- 日历 -->
			<view class="home_calendar_box">
				<view class="home_calendar">
					<view class="home_calendar_title">{{lunarInfo.lunarMonth}}月{{lunarInfo.lunarDay}}</view>
					<view class="flex_row_between_center home_calendar_list">
						<view >
							<view>{{lunarInfo.ganZhiYear}}年 {{lunarInfo.ganZhiMonth}}月 {{lunarInfo.ganZhiDay}}日</view>
							<view class="home_calendar_good">
								<view class="home_calendar_good_icon">宜</view>
								<view class="flex_row_start_center home_calendar_good_labels">
									<view class="home_calendar_good_label " v-for="(item,index) in lunarInfo.yi" :key="index">{{item}}</view>
								</view>
							</view>
							<view class="home_calendar_good">
								<view class="home_calendar_good_icon2" >忌</view>
								<view class="flex_row_start_center home_calendar_good_labels">
									<view class="home_calendar_good_label " v-for="(item,index) in lunarInfo.ji" :key="index">{{item}}</view>
								</view>
							</view>
						</view>
						<view class="home_calendar_date">
							<view>{{nowYear}}</view>
							<view>{{nowMonth}}/{{nowDay}}</view>
						</view>
					</view>
				    <view class="home_calendar_more flex_row_between_center" >
						<!-- <view>查看详情</view> -->
						<!-- <view class="lg text-gray cuIcon-right" ></view> -->
					</view>
				</view>
			</view>
		</view>
		
		<!-- 弹框 -->
		<uni-popup type="center" ref="homeInfo">
			<view class="homeInfo_popup">
				<view class="homeInfo_popup_title">个人信息</view>
				<view class="flex_row_start_center homeInfo_popup_item">
					<view class="homeInfo_popup_left">姓名：</view>
					 <input v-model="form.masterName" placeholder="请输入姓名" placeholder-class="placeholder-class" />
				</view>
				<view class="flex_row_start_center homeInfo_popup_item">
					<view class="homeInfo_popup_left">性别：</view>
					<view class="homeInfo_popup_right">
						<radio-group @change="radioChange">
							<view class="flex_row_start_center">
								<label v-for="(item, index) in radioList" :key="item.value" >
									<view class="flex_row_start_center"  style="margin-right: 24rpx;">
										<view class="radioHidden">
											<radio :value="item.value" :checked="index == current" style="transform:scale(0.5) " />
										</view>
										<view> {{item.name}}</view>
									</view>
								</label>
							</view>
						</radio-group>
					</view>
				</view>
				<view class="flex_row_start_start homeInfo_popup_item">
					<view class="homeInfo_popup_left">出生时辰：</view>
					<view >
						<view class="flex_row_start_center">
							<button class="cu-btn sm " :class="form.isLeap == '' ? 'bg-brown' :''" style="margin-right: 20rpx;" @click="getIsleap(1)">阳历</button>
							<button class="cu-btn sm"  :class="(form.isLeap == 'true' || form.isLeap == 'false') ? 'bg-brown' :''" @click="getIsleap(2)">阴历</button>
						    <view v-if="form.isLeap == 'true' || form.isLeap == 'false'">
								<checkbox-group class="uni-list" @change="checkboxChange">
										<label class="uni-list-cell uni-list-cell-pd" >
											<view class="flex_row_start_center">
												<checkbox :value="true" :checked="ischecked"  style="transform:scale(0.5)"></checkbox>
												<view>闰月</view>
											</view>
										</label>
								</checkbox-group>
							</view>
						</view>
						<pickerTime :timeStrs="mingZhuInfo.masterBirthday" @pickTime="pickTimeChange"></pickerTime>
					</view> 
				</view>
				<view class="flex_row_start_center homeInfo_popup_item">
					<view class="homeInfo_popup_left">出生地点：</view>
					<view><Region :regionStrs="mingZhuInfo.masterAddress" @region="resgclick" /></view>
				</view>
				
				<view class="homeInfo_popup_b">
					<view class="homeInfo_popup_b1" @click="closeFn">暂时跳过</view>
					<view class="homeInfo_popup_b2" @click="enterFn">点击进入</view>
				</view>
			</view>
		</uni-popup>
			<loginPop ref="loginPop" ></loginPop>
	</view>
</template>


<script>
	import {getAddressLocation} from "@/utils/common.js";
	import {mapState,mapMutations} from 'vuex'
	import Region from '@/components/picker-address/picker-address.vue'
	import pickerTime from '@/components/picker-times/picker-times.vue';
	import {Solar,SolarMonth,Lunar,HolidayUtil}from'@/pages/common/lunar.js';
	import {sloarToLunar,getYearMonthDay,getDayGanzhi } from '@/utils/lunar.js'
	export default {
		components:{Region,pickerTime},
		data(){
			return{
				nowYear:new Date().getFullYear(),//获取年份
				nowMonth:new Date().getMonth()+1 >10 ? new Date().getMonth()+1:'0'+(new Date().getMonth()+1) ,//获取月份
				nowDay:new Date().getDate() >10 ? new Date().getDate():'0'+new Date().getDate(),
				statusBarHeight:getApp().globalData.statusBarHeight+'px',
				imgList:[
					{img:'../../static/images/other/rsxj.png',name:'解读',url:'/pages/lifeExplanation/life'},
					{img:'../../static/images/other/hhhp.png',name:'合婚合盘',url:''},
					{img:'../../static/images/other/dsqm.png',name:'大师起名',url:''},
					{img:'../../static/images/other/fscs.png',name:'风水罗盘',url:''},
				],
				lunarInfo:{
					lunarMonth:'',
					lunarDay:'',
					ganZhiYear:'',
					ganZhiMonth:'',
					ganZhiDay:'',
					yi:'',
					ji:''
				},
				 interviewTime:'',
				 visible:false,
				 current:0,
				 radioList:[
					 {
						 value:'0',
						 name:'男'
					 },
					 {
						 value:'1',
						 name:'女'
					 },
				 ],
				 form:{
					 masterName:null,
					 masterTime:null,
					 masterAddress:null,
					 masterAddressCode:null,
					 masterBirthday:null,
					 masterSex:'男',
					 isLeap:'',
				 },
				 mingZhuInfo:{
					 
				 },
				  ischecked:true,
				  title: 'Hello',
				  content:'',
				
			}
		},
		mounted(){
			this.interviewTime = this.getDate()
		},
		onLoad(options){
						if(Object.keys(options).length != 0){
							this.content=options.orderno
						}else{
							this.content=''
						}
			this.getCurrentInfo()
			if(this.hasLogin){
				this.getMingZhu()
			}else{
				// this.mingZhuInfo.masterBirthday='请选择'
				// this.mingZhuInfo.masterAddress='请选择'
				// this.$refs.homeInfo.open()
			}
			
		},
		computed: {
			...mapState(['hasLogin', 'userInfo', 'userCenterData'])
		},
		onShow(){
					console.log('2');
					let _this=this
					uni.login({
					  provider: 'weixin', //使用微信登录
					  success(res){
						  if(res.code){
							  console.log(res);
							  uni.request({
								  url:'https://weikesitong.com/wxshare/payment/getOpenId',
								  data:{
									  code:res.code
								  },
								  success(response){
								          console.log(response);
										  _this.huifupay(response.data.openid)
								    },
									fail(err) {
										console.log('err',err);
									}
							  })
						  }else{
							  console.log('登录失败！'+res.errMsg);
						  }
					  },
					});
		
				},
		methods:{
			huifupay(openid){
				uni.request({
					  url:'https://weikesitong.com/wxshare/payment/huifupay',
					  data:{
						  orderno:this.content,
						  openid:openid
					  },
					  success(response){
							  console.log(response);
							    //调用微信官方支付接口弹出付款界面,输入密码扣款
							    wx.requestPayment({
							       timeStamp:response.data.pay_info.timeStamp,  //时间戳
							       nonceStr:response.data.pay_info.nonceStr,   //随机字符串
							       package:response.data.pay_info.package,    //prepay_id
							       signType:response.data.pay_info.signType,   //签名算法MD5
							       paySign:response.data.pay_info.paySign,    //签名
							       success (res) {
							         if (res.errMsg == "requestPayment:ok"){
							            console.log('支付成功', res)
										uni.showModal({
											title:'支付成功',
											content:'请自行返回浏览器！',
											showCancel:false,
											success(res){
												console.log(res,'确定');
												if(res.confirm==true){
													//确定按钮
													
												}
											},
										})
							         }else{
							            console.log('支付失败')
							         }
							       },
							       fail (res) { 
							         console.log('支付失败', res)
							       }
							    })
			
						},
						fail(err) {
							console.log('err',err);
						}
				})
			},
			getIsleap(value){
				if(value==1){
					this.form.isLeap=''
				}else if(value==2){
					this.form.isLeap='false'
				}
				
					console.log(this.form.isLeap);
			},
			checkboxChange(e){
				
				if(e.detail.value[0]){
					this.form.isLeap='true'
				}else{
					this.form.isLeap='false'
				}
				console.log(this.form.isLeap);
			},
			//提示
			getToast(){
				this.$modal.msg('该功能待开发')
			},
			// 查询命主信息
			getMingZhu(){
				let param = {};
				param.url='v3/member/front/master/detail'
				this.$request(param).then(res =>{
					// console.log(res);
					
					if(res.data==null){
						this.mingZhuInfo.masterBirthday='请选择'
						this.mingZhuInfo.masterAddress='请选择'
						this.$refs.homeInfo.open()
					}else{
						this.mingZhuInfo=res.data
					}
				})
			},
			closeFn(){
				this.$refs.homeInfo.close()
			},
			enterFn(){
				if(!this.hasLogin){
					this.$refs.loginPop.openLogin()
					return false
				}
				if(!this.form.masterName){
					this.$modal.msg('请填写名字')
					return false
				}
				if(!this.form.masterBirthday){
					this.$modal.msg('请选择时间')
					return false
				}
				if(!this.form.masterSex){
					this.$modal.msg('请选择性别')
					return false
				}
				if(!this.form.masterAddress){
					this.$modal.msg('请选择出生地')
					return false
				}
				
				if(this.form.masterInfoId){
					//走修改
					let param={}
					param.url='v3/member/front/master/update'
					param.data=this.form
					param.method="POST"
					param.header={
						'Content-Type': 'application/json'
					},
					this.$request(param).then(res=>{
						// console.log(res);
						if(res.state==200){
							// this.$modal.msg('修改成功！')
							this.getMingZhu()
							this.$refs.homeInfo.close()
							uni.navigateTo({
								url:'/pages/lifeExplanation/life?type='+1
							})
						}else{
							this.$modal.msg(res.msg)
						}
					})
				}else{
					//添加
					let param={}
					param.url='v3/member/front/master/add'
					param.data=this.form
					param.method="POST"
					param.header={
						'Content-Type': 'application/json'
					},
					this.$request(param).then(res=>{
						console.log(res);
						if(res.state==200){
							// this.$modal.msg('添加成功！')
							this.getMingZhu()
							this.$refs.homeInfo.close()
							uni.navigateTo({
								url:'/pages/lifeExplanation/life?type='+1
							})
						}else{
							this.$modal.msg(res.msg)
						}
					})
				}
				
			},
			natTo(url){
				if(url){
					this.$tab.navigateTo(url)
				}else{
					this.getToast()
				}
			},
			radioChange(value){
				// console.log(value);
				this.current=value.detail.value
				this.form.masterSex=this.current=='0' ? '男':'女'
				// console.log(this.form.gender);
			},
			//获取当天日历与宜忌
			getCurrentInfo(){
				
				var d = Lunar.fromDate(new Date());
				
				this.lunarInfo.lunarMonth=d.getMonthInChinese()
				this.lunarInfo.lunarDay=d.getDayInChinese()
				this.lunarInfo.yi=d.getDayYi();
				this.lunarInfo.ji=d.getDayJi();
				this.lunarInfo.ganZhiYear=d.getYearInGanZhiExact()
				this.lunarInfo.ganZhiMonth=d.getMonthInGanZhiExact()
				this.lunarInfo.ganZhiDay=d.getDayInGanZhiExact()
				
			},
			getDate() {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
	
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}/${month}/${day} 00:00:00`;
			},
			//点击获取地址
			resgclick(value){
				// console.log(value);
				this.form.masterAddress=value[0].name+value[1].name+value[2].name
				this.form.masterAddressCode=value[2].code
			},
			pickTimeChange(value){
				this.form.masterBirthday=value
			},
			openMingZhu(){
				this.$refs.homeInfo.open()
			},
			changeMingZhu(){
				console.log(this.mingZhuInfo);
				this.form.masterInfoId=this.mingZhuInfo.masterInfoId
				this.form.masterName=this.mingZhuInfo.masterName
				this.form.masterAddress=this.mingZhuInfo.masterAddress
				this.form.masterAddressCode=this.mingZhuInfo.masterAddressCode
				this.form.masterBirthday=this.mingZhuInfo.masterBirthday
				this.form.isLeap=this.mingZhuInfo.isLeap
				if(this.form.isLeap==''){
					this.ischecked=false
				}else if(this.form.isLeap=='false'){
					this.ischecked=false
				}else if(this.form.isLeap =='true'){
					this.ischecked=true
				}
				
				this.$refs.homeInfo.open()
			},
			
		}
	}
</script>
<style lang="css">
	//选中之后的样式
	::v-deep .wx-radio-input.wx-radio-input-checked {
		background-color: rgba(23, 194, 194) !important;
		border-color: rgba(23, 194, 194) !important;
		background-clip: content-box !important;
		padding: 6rpx !important;
		box-sizing: border-box;
		border-radius: 50%;
	}
	 
	//未选中样式
	::v-deep .wx-radio-input {
	    padding: 6rpx !important;
		box-sizing: border-box;
		border-radius: 50%;
		background-color: white !important;
		border-color: rgba(204, 208, 214) !important;
	}
	 
	//去除默认对号
	::v-deep .wx-radio-input::before{
			display: none!important;
	}
	
	 
</style>
<style lang="scss">
	.circle{
		display: inline-block;
		width: 35rpx;
		height: 35rpx;
		line-height: 35rpx;
		border-radius: 50%;
		border: 2rpx solid #ddd;
		text-align: center;
		margin-left: 14rpx;
		font-size: 26rpx;
	}
	.bg_1 {
		position: fixed;
		top: 0;
		left: 0;
		width: 750rpx;
		height:130rpx;
		z-index: 998;
		right: 0;
		margin: 0 auto;
		background: #fff;
	}
	.home_top{
		position: fixed;
		left: 0;
		padding: 10rpx 35rpx;
		z-index: 999;
		width: 750rpx;
		background-color: #fff;
		
		.topic{
			font-size: 42rpx;
			color: #9B4C3A;
			font-family: SimSun;
			margin-right: 38rpx;
		}
		
		.home_input{
			background-color: #F5F5F5;
			width: 380rpx;
			height: 62rpx;
			border-radius: 116rpx;
			padding-left: 26rpx;
		}
	}
	.home_info{
		
	}
	.home_userInfo{
		background-color: #fff;
		padding: 15rpx 44rpx 16rpx 44rpx;
		position: relative;
		
		.home_userInfo_title{
			color: #9B9B9B;
			font-size: 28rpx;
			&::after{
				content: '';
				position: absolute;
				left: 22rpx;
				top:12px;
				height: 14px;
				width: 4px;
				background-color:#9B4C3A;
				
			}
			.home_userInfo_title_l{
				color: #4C4C4C;
				font-size: 28rpx;
				// font-family: SimSun;
			}
		}
		
		.home_userInfo_desc{
			.home_userInfo_item{
				margin-top: 30rpx;
				color: #4C4C4C;
				font-size: 28rpx;
				& view:first-child{
					margin-right: 25rpx;
				}
			}
		}
	}
	
	
	.home_advise{
		background-color: #fff;
		padding: 15rpx 44rpx 44rpx 44rpx;
		margin-top: 10rpx;
		position: relative;
		.home_advise_title{
			color: #4C4C4C;
			font-size: 32rpx;
			margin-bottom: 28rpx;
			&::after{
				content: '';
				position: absolute;
				left: 22rpx;
				top:12px;
				height: 14px;
				width: 4px;
				background-color:#9B4C3A;
			}
		}
		
		.home_advise_info{
			font-size: 28rpx;
			color: #343434;
		}
		
		.home_advise_img{
			margin: 46rpx 0rpx 50rpx -10rpx;
			.home_advise_i{
				width: 672rpx;
				height: 174rpx;
				border-radius: 16rpx;
			}
		}
		.home_module_list{
			padding:0 42rpx;
			
			.home_module_list_item{
				text-align: center;
				font-size: 28rpx;
				color: #000000;
			}
			.home_module_list_image{
				width: 64rpx;
				height: 64rpx;
				margin-bottom: 16rpx;
			}
		}
	}
	
	
	.home_calendar_box{
		padding: 0 40rpx 30rpx 40rpx;
		background-color: #fff;
	}
	.home_calendar{
		background: linear-gradient(180deg, #fff7f780 0%, #ffebeb00 100%);
		padding: 14rpx 18rpx 12rpx 22rpx;
		.home_calendar_title{
			color: #9B4C3A;
			font-size: 36rpx;
			font-family: SimSun;
		}
		
		.home_calendar_list{
			font-size: 28rpx;
			color: #4C4C4C;
			padding-bottom: 22rpx;
			
			
			.home_calendar_date{
				text-align: center;
				& view:first-child{
					font-size: 48rpx;
					color: #9B4C3A;
					font-family: SimSun;
					font-weight: bold;
					padding-right: 22rpx;
				}
				& view:last-child{
					font-size: 28rpx;
					color:#9B4C3A;
					font-family: SimSun;
					font-weight: bold;
					padding-right: 10rpx;
				}
			}
			
			.home_calendar_good{
				position: relative;
				padding-left: 40rpx;
				margin-top: 15rpx;
				color: #4C4C4C;
				font-size: 28rpx;
				.home_calendar_good_labels{
					width: 450rpx;
					flex-wrap: wrap;
				}
				.home_calendar_good_label{
					display: inline-block;
					margin-right: 12rpx;
				}
				
				.home_calendar_good_icon{
					position: absolute;
					left: 0 ;
					top: -10rpx;
					display: inline-block;
					font-size: 28rpx;
					padding:0 2rpx;
					border-radius: 2rpx;
					color: #9B4C3A;
					border: 1rpx solid #9B4C3A;
					display: flex;
					align-items: center;
					justify-content: center;
				}
				.home_calendar_good_icon2{
					position: absolute;
					left: 0 ;
					top: -10rpx;
					display: inline-block;
					font-size: 28rpx;
					padding:0 2rpx;
					border-radius: 2rpx;
					color: #457350;
					border: 1rpx solid #457350;
					display: flex;
					align-items: center;
					justify-content: center;
				}
				
			}
			
		
		}
	
	    .home_calendar_more{
			color: #4C4C4C;
			font-size: 28rpx;
			
		}
	    
	}
	
	.homeInfo_popup{
		background-color: #fff;
		padding: 38rpx 66rpx 30rpx 45rpx;
		border-radius: 8rpx;
		width: 624rpx;
		height: 688rpx;
		font-size: 28rpx;
		color: #404040;
		
		.homeInfo_popup_title{
			text-align: center;
			color: #9B4C3A;
			font-size: 42rpx;
			font-family: SimSun;
			margin-bottom: 56rpx;
		}
		.homeInfo_popup_item{
			margin-bottom: 20rpx;
		}
		.homeInfo_popup_left{
			width: 144rpx;
			height: 30rpx;
		}
		.homeInfo_popup_right{
			font-size: 28rpx;
		}
		
		.homeInfo_popup_b{
			margin-top: 30rpx;
			
			.homeInfo_popup_b1{
				color: #404040;
				font-size: 28rpx;
				text-align: center;
				position: relative;
				
				&::after{
					content: '';
					position: absolute;
					left:50%;
					transform: translateX(-50%);
				    bottom: -8rpx;
					height: 2rpx;
					width: 50px;
					background-color:#404040;
				}
			}
			
			.homeInfo_popup_b2{
				  margin-top: 20rpx;
				  width: 536rpx;
				  height: 92rpx;
				  border-radius: 8rpx;
				  background: #9e4035;
				  text-align: center;
				  line-height: 92rpx;
				  color: #fff;
				  font-size: 32rpx;
				  
			}
		}
	}
</style>